---
comments: false
---
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport"
        content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
    <title>字帖详情</title>
    <style>
        #zitie-title {
            /* font-size: 3.2em; */
            font-weight: bold;
            margin-bottom: 5px;
        }

        #zitie-author {
            color: #666;
            margin-bottom: 5px;
        }

        #zitie-tip {
            color: #666;
            margin-bottom: 10px;
            font-size: small;
        }

        .data {
            opacity: 0.8;
            /* 初始时将数据的透明度设置为0，隐藏数据 */
            transition: opacity 0.5s ease;
            /* 添加过渡动画效果 */
            text-align: center;
            /* padding: 10px; */
            margin: 10px;
        }

        #zitie-cover {
            padding-bottom: 20px;
        }

        #backButton {
            background-image: url('images/back.png');
            width: 20px;
            height: 20px;
            background-size: cover;
            cursor: pointer;
            /* background-color: #666; */
        }
    </style>
</head>

<body>

    <div id="backButton"></div>
    <div class="data">
        <div id="zitie-tip">请前往 <a id="new-page" href="../app/index.html">临帖宝App</a> 查看字帖详情</div>
        <img id="zitie-cover" src="" alt="">
        <div id="zitie-title"></div>
        <div id="zitie-author"></div>
        <div id="zitie-describe"></div>
    </div>

    <script>
        // 获取诗词数据
        // 从localStorage中获取诗词数据

        var imgurl = localStorage.getItem('selectedZitieCover');
        var author = localStorage.getItem('selectedZitieAuthor');
        var name = localStorage.getItem('selectedZitieName');
        var describe = localStorage.getItem('selectedZitieDescribe');

        var postTitle = document.querySelector('.post-title');
    postTitle.style.display = 'none';
    var headeRight = document.querySelector('.header__right');
    headeRight.style.display = 'none';
    var headeLeft = document.querySelector('.header__left');
    headeLeft.style.display = 'none';

        // 在页面上展示诗词数据
        var img = document.getElementById('zitie-cover')
        img.src = imgurl;
        document.getElementById('zitie-title').textContent = name;
        document.getElementById('zitie-author').textContent = author;
        if (describe == "undefined") {
            describe = ""
        }
        document.getElementById('zitie-describe').textContent = describe;
        var img = document.getElementById('backButton');
        img.addEventListener('click', function () {
            window.history.back()
        });
    </script>
</body>

</html>